﻿/**DatePick控件*/
(function () {
    var template = "<input type=\"text\" :placeholder=\"placeholder\" :style=\"style\" :class=\"tClass\"  ref=\"inputz\" @click=\"CheckDateClick($event)\"/>";
    Vue.component("thk-datepick", {
        template: template,
        props: {
            format: {
                default: "yyyy-MM-dd"
            },
            value: {
                default: null
            },
            tClass: {
                default: "Wdate INPUT DATE"
            },
            placeholder: {
                default: ""
            },
            style: {
                default: function () {
                    return {};
                }
            }
        },
        methods: {
            CheckDateClick: function (event) {
                var that = this;
                WdatePicker({
                    el: event.target,
                    onpicked: function (dp) {
                        var _date = dp.cal.date;
                        //console.log(_date);
                        //console.log(_date);
                        var date = new Date(_date.y, (_date.M - 1), _date.d, _date.H, _date.m, _date.s);
                        if (that.value == null || date.format(that.format) != that.value.format(that.format)) {
                            that.value = date;
                            that.$emit('input', date);
                            //console.log("zz");
                            that.$emit('change', date);
                            //that.change(that.value);
                        }
                        //console.log(date);
                    },
                    dateFmt: that.format
                });
            }
        },
        watch: {
            value: function (val) {
                //console.log("又被初始化了");
                var that = this;
                //that.value = val;
                if (val == null) {
                    this.$refs.inputz.value = "";
                } else {
                    if (val.format(that.format) == this.$refs.inputz.value) {
                        return;
                    }
                    that.$emit('change', val);
                    //console.log(this);
                    //console.log(val.format(that.format));
                    this.$refs.inputz.value = val.format(that.format);
                }
                //console.log(val != that.value ? "同步" : "异步");
                //更新父级
            }
        },
        mounted: function () {
            if (this.value == null) {
                this.$refs.inputz.value = "";
            }
            else {
                this.$refs.inputz.value = this.value.format(that.format);
            }
        }
    });
}());
/**Pagination分页控件*/
(function () {
    var template = "<div id=\"app\" style=\"width: 100%;\">" +
        "        <div style=\"margin: 0 auto; font-size: 14px; color: #B0B0B0; text-align: center;\">" +
        "            <button type=\"button\" style=\"width: 8px; height: 14px; margin: 0; padding: 0; border: 0; outline: none; background-image: url(\'/Content/Images/左箭头.png\'); color: white; background-color: white; margin-right: 5px; cursor: pointer; \"" +
        "                    @click=\"GoLeft\"></button>" +
        "            <div style=\"display: inline-block; font-size: 14px; color: white; margin-left: 5px; \">" +
        "                <button v-if=\"PageCount==1||PageCount==0\" type=\"button\" style=\"border: 0; background-color: rgb(255, 87, 34); margin: 3px; padding: 3px 10px; color: white;\"" +
        "                        @click=\"Go(1)\">" +
        "                    1" +
        "                </button>" +
        "                <template v-if=\"PageCount>1\" v-for=\" item in Data\">" +
        "                    <button v-if=\"item==CurrentPage\" type=\"button\" style=\"border: 0; background-color: rgb(255, 87, 34); margin: 3px; padding: 3px 10px; color: white; \"" +
        "                            @click=\"Go(item.Index)\">" +
        "                        {{item.Index}}" +
        "                    </button>" +
        "                    <button v-if=\"item!=CurrentPage\" type=\"button\" style=\"border: 0; margin: 3px; padding: 3px 10px; \" @click=\"Go(item.Index)\">{{item.Index}}</button>" +
        "                </template>" +
        "            </div>" +
        "            <button type=\"button\" style=\"width: 8px; height: 14px; margin: 0; padding: 0; border: 0; outline: none; background-image: url(\'/Content/Images/右箭头.png\'); color: white; background-color: white; margin-left: 5px; cursor: pointer;\"" +
        "                    @click=\"GoRight \"></button> 到第" +
        "            <input type=\"text\" v-model=\"ToCurrentPage\" style=\"width:30px;background-color: white; border: 0; border: 1px solid #B0B0B0; text-align: center; margin: 3px; padding: 3px 10px;\" />页" +
        "            <button @click=\"Go(ToCurrentPage)\" type=\"button\" style=\"color: #000; background-color: white; border: 1px solid #B0B0B0; text-align: center; margin: 3px; padding: 3px 10px; \">确定</button>共" +
        "            <span>{{RowCount}}</span>条,{{PageCount}}页" +
        "            <select style=\"border: 1px solid #B0B0B0;\" v-model=\"RowsPerPage\">" +
        "                <template v-for=\"item in PerArry\">" +
        "                    <option :value=\"item\">{{item}}条/页</option>" +
        "                </template>" +
        "            </select>" +
        "            <button type=\"button\" class=\"bt_css_s\" @click=\"Go(1)\">首页</button>" +
        "            <button type=\"button\" class=\"bt_css_s\" @click=\"GoLeft\">上一页</button>" +
        "            <button type=\"button\" class=\"bt_css_s\" @click=\"GoRight\">下一页</button>" +
        "        </div>" +
        "    </div>";
    //console.log(template);
    //return;
    Vue.component("thk-pagination", {
        template: template,
        props: {
            value: {
                default: null
            },
            PerArry: {
                default: [50, 100, 200, 400, 800, 1600]
            },
            RowsPerPage: {
                default: 50
            },
            PageCount: {
                default: 0
            },
            RowCount: {
                default: 0
            },
            ToCurrentPage: {
                default: 1
            },
            Data: {
                default: []
            },
            CurrentPage: {
                default: 0
            }
        },
        methods: {
            Go: function (page) {
            },
            GoLeft: function () {
                var that = this;
                var page = that.CurrentPage;
                this.$emit("page-callback", {
                    Page: page,
                    Set: function (sum, current) {
                        //写入最大条数
                        if (current != null) {
                            that.CurrentPage = current;
                        }
                        that.RowCount = 0;
                        var pc = Math.ceil(that.RowCount / that.RowsPerPage);
                        that.PageCount = pc == 0 ? 1 : pc;
                    }
                });
            },
            GoRight: function () {
            }
        },
        mounted: function () {
            console.log("xx");
        }
    });
}());
/**选择公司控件*/
(function () {
    /*
    var template = "<input type=\"text\" :placeholder=\"placeholder\" :style=\"style\" :class=\"tClass\"  ref=\"inputz\" @click=\"CheckDateClick($event)\"/>";*/
    var template = "<select class=\"INPUT\" v-model=\"value\"><template v-for=\"item in Data\"><option :value=\"item.Value\" selected=\"selected\" v-if=\"item.Value.toString()==value.toString()\">{{item.Text}}</option><option :value=\"item.Value\" v-if=\"item.Value!=value.toString()\">{{item.Text}}</option></template></select>";
    Vue.component("thk-company", {
        template: template,
        props: {
            value: {
                default: -1
            },
            Data: {
                default: []
            }
        },
        watch: {
            value: function (curVal, oldVal) {
                console.log(curVal);
                this.$emit('input', curVal);
                this.$emit('change', curVal, oldVal);
            }
        },
        mounted: function () {
            //Ajax加载数据
            this.Data = [
                {
                    Text: "未选择",
                    Value: "-1"
                }
            ];
            var that = this;
            //同步获取
            var data = top.window.AllCompanyInfo;
            if (data == undefined) {
                $.ajax({
                    async: false,
                    url: "/Module/ApplyView/ApplyHandler.ashx?MethodType=AllCompanyInfo",
                    type: "POST",
                    success: function (result) {
                        //console.log(result);
                        if (result.Type != 1) {
                            return;
                        }
                        data = result.Data;
                        top.window.AllCompanyInfo = data;
                    }
                });
            }
            for (var i = 0; i < data.length; i++) {
                var company = data[i];
                that.Data.push({ Text: company.Name, Value: company.Id });
            }
        }
    });
}());